<template>
  <div class="app-container">
    <el-card class="box-card">
      <div slot="header" class="card-title">
        <span>产品管理</span>
      </div>
      <div class="product-box">
        <el-table :data="tableData" stripe style="width: 100%" :header-cell-style="{background:'#e1e4e5'}">
          <el-table-column prop="id" label="序号" width="55px">
          </el-table-column>
          <el-table-column prop="proNum" label="产品编号">
          </el-table-column>
          <el-table-column prop="productName" label="产品名称">
          </el-table-column>
          <el-table-column prop="minLimit" label="最小期（月）" width="110px">
          </el-table-column>
          <el-table-column prop="maxLimit" label="最大期（月）" width="110px">
          </el-table-column>
          <el-table-column prop="earning" label="利率类型">
          </el-table-column>
          <el-table-column prop="ReturnMoney" label="回款方式" width="110px">
          </el-table-column>
          <el-table-column prop="proLowerInvest" label="起投金额（元）" width="130px">
          </el-table-column>
          <!-- formatter内容的格式化 -->
          <el-table-column prop="status" label="状态" :formatter="stateFormat">
          </el-table-column>
          <el-table-column prop="date" label="操作">
            <el-button disabled type="primary" size="mini">管理</el-button>
          </el-table-column>
        </el-table>
      </div>
    </el-card>
  </div>
</template>

<script>
import { mapActions } from 'vuex';
export default {

  data() {
    return {
      tableData: [
  
      ],
    };
  },

  mounted() {},

  methods: {
    ...mapActions({
      getproductList:'invest/getProductList'
    }),
    stateFormat(row){
      if(row.status === 0){
        return '关闭'
      }else{
        return '正常'
      }
    }
  },
  created(){
    this.getproductList().then(data => {
      if(data){
        this.tableData = data
      }
    })
  }
};
</script>
<style lang="scss" scoped>
.app-container {
  .card-title {
    font-size: 22px;
  }
}
</style>
